<template>
  <el-dialog
    title="轨迹数据"
    :visible.sync="dialogVisible"
    width="1000px">
    <el-table
      :data="datajson"
      border
      ref="singleTable"
      highlight-current-row
      :header-cell-style="{background:'#17b3a3',color:'#FFFFFF'}"
      v-loading="dataListLoading"
      style="width: 100%;">
      <el-table-column
        prop="eid"
        header-align="center"
        align="center"
        label="人员编号">
      </el-table-column>
      <el-table-column
        prop="ename"
        header-align="center"
        align="center"
        label="人员姓名">
      </el-table-column>
      <el-table-column
        prop="area1"
        header-align="center"
        align="center"
        label="所在区域">
      </el-table-column>
      <el-table-column
        prop="labelPosX"
        header-align="center"
        align="center"
        label="X坐标">
      </el-table-column>
      <el-table-column
        prop="labelPosY"
        header-align="center"
        align="center"
        label="Y坐标">
      </el-table-column>
      <el-table-column
        prop="labelPosTime"
        header-align="center"
        align="center"
        label="时间">
      </el-table-column>
    </el-table>
    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[10, 20, 50, 100]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>
  </el-dialog>
</template>

<script>
export default {
  name: 'locationdata',
  data(){
    return {
      dataForm: {
        key: ''
      },
      datajson: [],
      dataList: [],
      pageIndex: 1,
      pageSize: 10,
      totalPage: 0,
      dataListLoading: false,
      dataListSelections: [],
      addOrUpdateVisible: false,
      Visiable: false,
      dialogVisible:false,
      aa: false,
      area: {
        area1: ''
      }
    }
  },
  methods:{
    // 每页数
    sizeChangeHandle (val) {
      this.pageSize = val
      this.pageIndex = 1
      this.fetchData()
    },
    // 当前页
    currentChangeHandle (val) {
      this.pageIndex = val
      this.fetchData()
    },
    init(eid,ename){
      this.dialogVisible = true;
      console.log('子组件eid为' + eid)
      console.log('子组件ename为' + ename)
      this.no = eid;
      this.name = ename;
      this.dataForm.key = eid;
      this.fetchData();
    },
    fetchData(){
      this.$http({
        url: this.$http.adornUrl('/emp/employee/getLocation'),
        method: 'get',
        async: false,
        params: this.$http.adornParams({
          'page': this.pageIndex,
          'limit': this.pageSize,
          'eid': this.dataForm.key
        })
      }).then(({data}) => {
        if(data){
          this.datajson = data.page.records
          this.totalPage = data.page.total
          for (var i = 0; i < this.datajson.length; i++) {
            this.datajson[i].eid = this.no;
            this.datajson[i].ename = this.name;
          }
          console.log(data)
          // [{"labelIdcard":21121029,"labelPosX":100.0,"labelPosY":100.0,"labelPosTime":"2022-08-21 16:47:56"},
          // {"labelIdcard":21121029,"labelPosX":200.0,"labelPosY":1200.0,"labelPosTime":"2022-09-17 19:38:15"},
          // {"labelIdcard":21121029,"labelPosX":300.0,"labelPosY":800.0,"labelPosTime":"2022-09-17 19:38:24"}]
          for (var i = 0; i < this.datajson.length; i++) {
            console.log("当前人员的X坐标为：" + this.datajson[i].labelPosX)
            console.log("当前人员的Y坐标为：" + this.datajson[i].labelPosY)
            console.log(this.datajson[i].labelPosX<150)
            if(0<this.datajson[i].labelPosX && this.datajson[i].labelPosX<150 && 0<this.datajson[i].labelPosY && this.datajson[i].labelPosY<150){
              this.datajson[i].area1 = '上料区'
              console.log("111")
            }else if(150<this.datajson[i].labelPosX && this.datajson[i].labelPosX<250 && 0<this.datajson[i].labelPosY && this.datajson[i].labelPosY<1300){
              this.datajson[i].area1 = '中厚板整理区'
              console.log("222")
            }else {
              this.datajson[i].area1 = '其他区域'
              console.log("333")
            }
          }
          this.dataListLoading = false
        }else{
          this.datajson = []
          this.totalPage = 0
        }

      })
    }
  }
}
</script>

<style scoped>

</style>
